<template>
  <div class="article-comments">
    <!-- 评论列表 -->
    <slot name="comment"> </slot>
    <!-- 评论列表 -->

    <!-- 发布评论 -->
    <!-- <van-cell-group class="publish-wrap">
      <van-field v-model="value" clearable placeholder="请输入评论内容">
        <template #button>
          <van-button size="mini" type="primary" @click="send(value)"
            >发布</van-button
          >
        </template>
      </van-field>
    </van-cell-group> -->
    <!-- /发布评论 -->
  </div>
</template>

<script>
export default {
  name: "Comment",
  props: {},
  data() {
    return {
      list: ["good"], // 评论列表
      loading: false, // 上拉加载更多的 loading
      finished: false, // 是否加载结束
      user_name: "Gentle",
      comment_content: "哇噢，从小培养这方面兴趣爱好",
      icon_name: ["like-o", "like-o", "like-o"],
      value: "",
    };
  },

  methods: {
    onLoad() {
      // 异步更新数据
      setTimeout(() => {
        for (let i = 0; i < 10; i++) {
          // this.list.push(this.list.length + 1);
          this.icon_name.push("like-o");
        }
        // 加载状态结束
        this.loading = false;

        // 数据全部加载完成
        if (this.list.length >= 40) {
          this.finished = true;
        }
      }, 500);
    },

    send(value) {
      this.list.push(value);
      this.value = "";
    },
  },
};
</script>

<style scoped>
.publish-wrap {
  position: fixed;
  left: 0;
  bottom: 0;
  width: 100%;
}

.van-list {
  margin-bottom: 45px;
}
</style>
